<template>
  <div id="systemSettings" class="person-detail">
    <div>
      <van-nav-bar
        title="系统设置"
        :fixed="true"
        left-arrow
        @click-left="back()"
      />
    </div>
    <div>
      <van-cell-group>
        <van-cell title="关于" is-link to="/person/concerning" />
        <div class="line-bottom"></div>
        <van-cell title="清除缓存" :value="value" @click="clearCache()" />
      </van-cell-group>
    </div>
    <div class="mine-out">
      <van-button type="default" @click="exit()">退出登录</van-button>
    </div>
    <van-dialog
      v-model="showDialog"
      message="你确定要退出智慧社区？"
      @confirm="confirm"
      @cancel="cancel"
    >
    </van-dialog>
  </div>
</template>
<script>
import mine from "../../../controller/mine";
export default {
  name: "systemSettings",
  components: {},
  data() {
    return {
      showDialog: false,
      value: "5.65M"
    };
  },
  computed: {},
  created() {},
  mounted() {},
  methods: {
    clearCache() {
      this.value = "0M";
      this.$toast("清除成功！");
    },
    exit() {
      this.$dialog
        .confirm({
          message: "你确定要退出智慧社区？",
          showCancelButton: true
        })
        .then(() => {
          mine.security_v1_logout().then(res => {
            if (res.code == "0") {
              localStorage.removeItem('userInfo')
              localStorage.removeItem('historyList')
              this.$router.push({ path: "/login" });
            } else {
              this.$toast(res.msg);
            }
          });
        })
        .catch(() => {});
    },
    back() {
      this.$router.go(-1);
    },
    cancel() {
      this.showDialog = false;
    },
    confirm() {
      this.showDialog = false;
    }
  }
};
</script>
<style lang="scss" scoped>
#systemSettings {
  background: #f5f7fa;
  .van-cell-group {
    padding-top: 20px;
  }
  .mine-out {
    margin-top: 20px;
    button {
      width: 100%;
      height: 80%;
      margin: auto;
      display: block;
      font-family: PingFangSC-Medium;
      font-size: 20px;
      color: #333333;
      letter-spacing: 0;
      text-align: center;
    }
  }
}
</style>
<style lang="scss">
@import "../style/index.scss";
</style>
